<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8">
    <title>layui</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" th:href="@{/lib/layui-v2.5.5/css/layui.css}" media="all">
    <link rel="stylesheet" th:href="@{/css/public.css}" media="all">
    <style>
        body {
            background-color: #ffffff;
        }
    </style>
</head>
<body>
<div class="layui-form layuimini-form">
    <div class="layui-form-item">
        <label class="layui-form-label required">快递单号</label>
        <div class="layui-input-block">
            <input type="text" name="orderNumber" lay-verify="required" lay-reqtext="快递单号不能为空" placeholder="请输入快递单号" value="" class="layui-input">
            <tip>填写快递单号</tip>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label required">取件码</label>
        <div class="layui-input-block">
            <input type="text" name="pickUpCode" lay-verify="required" lay-reqtext="取件码不能为空" placeholder="请输入取件码" value="" class="layui-input">
            <tip>填写取件码</tip>
        </div>
    </div>
    <div class="layui-form-item">
        <label class="layui-form-label required">录入时间</label>
        <div class="layui-input-block">
            <input type="text" id="inputTime" name="inputTime" lay-verify="required" lay-reqtext="录入时间不能为空" placeholder="请输入时间" value="" class="layui-input">
            <tip>默认为当前时间</tip>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label required">宿舍</label>
        <div class="layui-input-block">
            <input type="text" name="domitoryName"
                   placeholder="请输入" autocomplete="off" class="layui-input" id="domitoryName" required>
        </div>
    </div>

    <div class="layui-form-item">
        <!--<label class="layui-form-label required">宿舍</label>-->
        <div class="">
            <input type="hidden" name="domitoryId" class="layui-input" id="domitoryId" required>
        </div>
    </div>

    <div class="layui-form-item">
        <label class="layui-form-label required">收件人</label>
        <div class="layui-input-block">
            <input type="text" id="addressee" name="addressee" lay-verify="required" lay-reqtext="收件人不能为空" placeholder="请输入收件人" value="" class="layui-input">
        </div>
    </div>

    <div class="layui-form-item">
        <div class="layui-input-block">
            <button class="layui-btn layui-btn-normal" lay-submit lay-filter="saveBtn">确认保存</button>
        </div>
    </div>
</div>
<script th:src="@{/lib/layui-v2.5.5/layui.js}" charset="utf-8"></script>
<script th:src="@{/js/lay-config.js?v=1.0.4}" charset="utf-8"></script>
<script lang="JavaScript", th:inline="javascript">
    layui.use(['form', 'laydate', 'tableSelect'], function () {
        var form = layui.form,
            layer = layui.layer,
            $ = layui.$,
            laydate = layui.laydate,
            tableSelect = layui.tableSelect;

        var nowTimestamp = new Date().getTime();
        var selectDomitory;

        //执行一个laydate实例,录入时间
        laydate.render({
            elem: '#inputTime', //指定元素
            type: 'datetime',
            format: 'yyyy-MM-dd HH:mm:ss',
            value: new Date(nowTimestamp),
            isInitValue: true,
            done: function (value) {
                console.log(value);
            }
        });

        tableSelect.render({
            elem: '#domitoryName',
            checkedKey: 'id',
            searchKey: 'name',
            table: {
                url: '../../api-v1/domitory/search',
                cols: [ [
                    { type: 'radio' },
                    { field: 'id', title: 'ID' },
                    { field: 'name', title: '宿舍名' },
                    { field: 'surplusPower', title: '剩余电量' }
                ] ]
            },
            done: function (elem, data) {
                selectDomitory = data.data[0];
                var NEWJSON = []
                layui.each(data.data, function (index, item) {
                    NEWJSON.push(item.name)
                })
                $("#domitoryId").val(selectDomitory.id)
                elem.val(NEWJSON.join(","))
            }
        });

        //监听提交
        form.on('submit(saveBtn)', function (data) {

            console.log(JSON.stringify(data.field));

            $.ajax({
                url: "../../api-v1/expressDelivery/add",
                method: "post",
                data: JSON.stringify(data.field),
                contentType: "application/json; charset=utf-8",
                success: function (result) {
                    var index = layer.alert(result.msg, {
                        title: '提交信息',
                        icon: 1
                    }, function () {
                        // 关闭弹出层
                        layer.close(index);

                        var iframeIndex = parent.layer.getFrameIndex(window.name);
                        parent.layer.close(iframeIndex);
                        // 重载表格
                        window.parent.location.reload();
                    });
                }
            });
            return false;
        });
    });
</script>
</body>
</html>